{% if error %}
  <div class="alert alert-danger alert-dismissible">Payment Error: {{ error }}</div>
{% else %}
  {% if text_testing %}
    <div class="alert alert-warning alert-dismissible">{{ text_testing }}</div>
  {% endif %}
  <div class="d-inline-block pt-2 pd-2 w-100">
    <div class="float-right">
      <button type="button" id="button-confirm" data-loading-text="{{ text_loading }}" class="btn btn-primary">{{ button_pay }}</button>
    </div>
  </div>
  <script src="https://secure.ewaypayments.com/scripts/eCrypt.js"></script>
  <script type="text/javascript">//<!--
  /**
   * eWAY Rapid IFrame config object.
   */
  var eWAYConfig = {
	  sharedPaymentUrl: "{{ SharedPaymentUrl }}"
  };

  /**
   * eWAY Rapid IFrame callback
   */
  function resultCallback(result, transactionID, errors) {
	  if (result == "Complete") {
		  window.location.href = "{{ callback }}";
	  } else if (result == "Error") {
		  $('#button-confirm').button('reset');
		  alert("There was a problem completing the payment: " + result);
	  } else {
		  $('#button-confirm').button('reset');
	  }
  }

  $('#button-confirm').bind('click', function() {
	  $('#button-confirm').button('loading');
	  eCrypt.showModalPayment(eWAYConfig, resultCallback);
  });

  //--></script>
{% endif %}